<!--
	作者：956911785@qq.com
	时间：2019年10月16日14:12:15
	描述：账号权限设置-添加
-->

<template>
	<Modal :title="title" v-model="modal0" width="350px">
		<Form ref="params" :model="params" :rules="ruleValidate" :label-width="120" label-position="left">
			<div style="width:100%;height:120px;">
				<div style="width:100%;height:60px;line-height: 60px;float:left;text-align: left;">
					<FormItem  prop="dlzh" label="账号">
						<Input v-model.trim="params.dlzh" placeholder="请填写账号" clearable :disabled="disabled" style="width: 150px"></Input>
					</FormItem>	
				</div>
				
				<div style="width:100%;height:60px;line-height: 60px;float:left;text-align: left;">
					<FormItem  prop="permission" label="权限">
						<Select v-model.trim="params.permission" style="width:150px" clearable>
							<Option value="1" >语文教研组组长</Option>
							<Option value="4" >语文审核教师</Option>
							<Option value="2" >语文组长</Option>
							<Option value="3" >后勤</Option>
						</Select>
					</FormItem>	
		      	</div>
		   </div> 
	    </Form>
	   	<div slot="footer">
	    	<Button type="text"  @click="closeModal()">取消</Button>
	    	<Button type="primary" @click="addsave()" >确定</Button>
	    </div>
     </Modal>
</template>

<script>

	
	export default {
		name:"tconent",
		props: {
    		title:{
    			type:String,	
    		},
			paramsjs:{
				type:Object,	
				default: function() {
					return null
				}
			},
    	},
		data() {
			//长度控制
			const lenPass = (rule, str, callback) => {
			  if(str.length>rule.length){
			  	 callback(new Error('字符串长度在1-'+rule.length+'之间！'));
			  }
			  return callback();
			};
			
			return {   
                modal0:false,
                params:{
					dlzh:'',
					permission:''
				},
				disabled:false,
				ruleValidate: {
					dlzh: [
				        {required: true, message: '请填写账号！', trigger: 'blur'},
				        {length:30,validator:lenPass,trigger:'blur'}
				    ],
				    permission: [
				        {required: true, message: '选择权限！', trigger: 'blur'},
				    ],
				},  
			} 
		},
		methods: {
			addsave:function(){
				this.$refs.params.validate((valid) => {
					if (valid){
						const params={...this.params};
						this.$emit("addsave",params);
				    }
				})
	        }, 
			
            closeModal(){
	      	    this.modal0 = false;
	        },
			
			resetpar(){
				this.params={
					dlzh:'',
					permission:''
				}
			}
		},
		mounted() {
			
		},
		watch:{
			modal0(news,olds){
				if(!news){
					 this.resetpar();
				}else{
					this.params={...this.paramsjs};
					if(this.params.dlzh){
						this.disabled=true;
					}
				}
			}
		},
		computed: {
		
		}
		
	}
</script>

<style scoped="scoped">
	
</style>



